$(function () {
//权限列表目标标记
    var tree_target = [];
    var total_level = 5;//权限总级别
    //背景颜色配置
    var bg_arr = ['#FFF', '#FFF', '#FFF', '#FFF'];
    layui.use(['form'], function () {
        form = layui.form;
        form.on('checkbox(group_form)', function(data){
            var checked = $(this).prop('checked');
            var target = $(this).attr('data-target');
            target = target.split(',');

            var curr_data = find_data_by_target(TREE_DATA, target);
            curr_data['checked'] = checked;

            down_alter(curr_data['children'], checked);
            up_alter(TREE_DATA, target);

            $("#tree_box").html(createTable(TREE_DATA));
            form.render();

        });

        $("#tree_box").html(createTable(TREE_DATA));
        form.render();
    });

    function createTable(data) {
        var html = "<table  class='layui-table'>";
        var compile_tree_result = compile_tree(data, 0, '');
        html += '<tr>'+compile_tree_result.first_html+'</tr>';
        html += compile_tree_result.last_html;
        html += "</table>";
        return html;
    }

    //编译树
    function compile_tree(data, level, html) {
        var child_num_arr = [];
        var rowspan_num = 0;
        var total_child_num = 0;
        var total_num = 0;
        var html_obj = [];

        var first_html = "";
        var last_html = "";
        $.each(data, function (i, data_item) {
            var child_num = data_item['children'] ? Object.keys(data_item.children).length : 0;
            child_num_arr.push(child_num);
            total_num += 1;
            total_child_num += child_num;
            var checked = data_item['checked'] ? data_item['checked'] : false
            html_obj.push({checked: checked, child_num: child_num, data: data_item, name: data_item.module_id});
        });
        if(total_num > 0){
            if(total_child_num>0){
                var is_first = true;
                $.each(html_obj,function(i,item){
                    var item_obj = item.data;
                    var item_html = "";
                    var rowspan = 0;
                    var name = item['name'];
                    tree_target[level] = name;
                    tree_target = tree_target.slice(0, level + 1);

                    var checked_html = item.checked ? 'checked' : '';
                    var input_html = '<input class="group-checkbox" type="checkbox"  ' + checked_html + ' lay-filter="group_form" lay-skin="primary" '+ checked_html +' title="'+item['data']['module_name']+'" data-target="' + tree_target.toString() + '" value="' + item['data']['module_id'] + '"/>';
                    var child_num = item.child_num;
                    var colspan_html = "";
                    var child_first_html = "";
                    var child_last_html = "";
                    if (child_num > 0){
                        var item_result = compile_tree(item_obj['children'], level + 1, '');
                        var rowspan = item_result.rowspan;
                        var child_first_html = item_result.first_html;
                        var child_last_html = item_result.last_html;
                    }
                    if(child_first_html == '' ){
                        var colspan_num = total_level - level;
                        colspan_html = " colspan="+colspan_num;
                    }

                    if(!is_first){
                        item_html += '<tr>';
                    }

                    if(rowspan > 1){
                        rowspan_num = rowspan_num + rowspan;
                        item_html += '<td rowspan = "'+rowspan+'" '+colspan_html+' >';
                    }else{
                        rowspan_num += 1;
                        item_html += '<td '+colspan_html+'>';
                    }
                    item_html += input_html;
                    item_html += '</td>';

                    item_html += child_first_html;

                    if(!is_first) {
                        item_html += '</tr>';
                    }

                    item_html += child_last_html;
                    if(is_first){
                        first_html += item_html;
                        is_first = false;
                    }else{
                        last_html += item_html;
                    }
                });
            }else{
                var colspan_num = total_level - level;
                var colspan_html = " colspan="+colspan_num;
                first_html += '<td '+colspan_html+' >';
                rowspan_num = 1;
                $.each(html_obj,function(i,item){
                    var name = item['name'];
                    tree_target[level] = name;
                    tree_target = tree_target.slice(0, level + 1);

                    var checked_html = item.checked ? 'checked' : '';
                    var input_html = '<input class="group-checkbox" type="checkbox"  ' + checked_html + ' lay-filter="group_form" lay-skin="primary" '+ checked_html +' title="'+item['data']['module_name']+'" data-target="' + tree_target.toString() + '" value="' + item['data']['module_id'] + '"/>';

                    first_html += input_html;
                })
                first_html += '</td>';
            }
        }
        return {rowspan:rowspan_num,first_html:first_html,last_html:last_html};
    }
    //绑定点击事件
    $("#tree_box").on('click', '.menu-cell input', function () {
        var checked = $(this).prop('checked');
        var target = $(this).attr('data-target');
        target = target.split(',');

        var curr_data = find_data_by_target(TREE_DATA, target);
        curr_data['checked'] = checked;

        down_alter(curr_data['children'], checked);
        up_alter(TREE_DATA, target);

        $("#tree_box").html(createTable(TREE_DATA));
        form.render();
    });

    //通过标记找到数据位置
    function find_data_by_target(list, target) {
        var data = list;
        for (var per in target) {
            if (per == 0) {
                data = data[target[per]];
            } else {
                data = data['children'][target[per]];
            }
        }
        return data;
    }

    //向上遍历
    function up_alter(list, target) {

        target = target.slice(0, target.length - 1);
        if (target.length == 0) return;

        var curr_data = find_data_by_target(TREE_DATA, target);

        var count = 0;
        for (var per in curr_data['children']) {
            if (curr_data['children'][per]['checked']) {
                count++;
                break;
            }
        }
        if (count == 0) {
            curr_data['checked'] = false;
        } else {
            curr_data['checked'] = true;
        }

        up_alter(list, target);
    }

    //向下遍历
    function down_alter(list, checked) {
        for (var per in list) {
            list[per]['checked'] = checked;
            var child_num = list[per]['children'] ? Object.keys(list[per].children).length : 0;
            if (child_num > 0) down_alter(list[per]['children'], checked)
        }
    }
})
